<template>
	<div>
	  
	  <myheader></myheader>
  
	  <br>
		  <!-- 面包屑导航 -->
		  <Breadcrumb :datas='datas'></Breadcrumb>
	  <section class="featured-block text-center">
		  <div class="container">
			  
			  <table>
				  <tr style='padding: 5px;'>
					  <td style='padding: 5px;'>
						  商品名称(name):
					  </td>
					  <td style='padding: 5px;'>
						  <input type="text" name="" id="" v-model='name'>
					  </td>
				  </tr>

				  <tr style='padding: 5px;'>
					<td style='padding: 5px;'>
						HeyUi商品标签(mytags):
					</td>
					<td style='padding: 5px;'>

						<!-- heyui标签显示 -->
						<TagInput
							v-model="mytags"
							type="string"
							split=","
							placeholder="
							请输入标签,输入完毕后按回车确认
							"
						>
													
						</TagInput>
					</td>
				</tr>

				  <tr style='padding: 5px;'>
					  <td style='padding: 5px;'>
						  商品描述(desc):
					  </td>
					  <td style='padding: 5px;'>
						  <textarea name="" id="" cols="30" rows="3" v-autosize v-wordcount="30" v-model="desc"></textarea>
					  </td>
				  </tr>
				  
				<tr style='padding: 5px;'>
					<td style='padding: 5px;'>
						商品价格(price):
					</td>
					<td style='padding: 5px;'>
						<input type="text" name="" id="" v-model='price'>
					</td>
				</tr>

				  <tr style='padding: 5px;'>
					<td style='padding: 5px;'>
						商品颜色(color):
					</td>
					<td style='padding: 5px;'>
						<input type="text" name="" id="" v-model='color'>
					</td>
				</tr>

				<tr style='padding: 5px;'>
					<td style='padding: 5px;'>
						商品尺码(size):
					</td>
					<td style='padding: 5px;'>
						<input type="text" name="" id="" v-model='size'>
					</td>
				</tr>

				<tr style='padding: 5px;'>
					<td style='padding: 5px;'>
						商品规格(season):
					</td>
					<td style='padding: 5px;'>
						<input type="text" name="" id="" v-model='season'>
					</td>
				</tr>

				<tr style='padding: 5px;'>
					<td style='padding: 5px;'>
						商品分类(cate_id):
					</td>
					<td style='padding: 5px;'>
						<input type="text" name="" id="" v-model='cate_id'>
					</td>
				</tr>

				<tr style='padding: 5px;'>
					<td style='padding: 5px;'>
						商品标签(tags):
					</td>
					<td style='padding: 5px;'>
						<input type="text" name="" id="" v-model='tags'>

					</td>
				</tr>

				
				  <tr style='padding: 5px;'>
					  <td style='padding: 5px;'>
  
					  </td>
					  <td style='padding: 5px;'>
						  <Button @click='submit'>新增商品</Button>&nbsp;&nbsp;

						  <Button @click="add_tags">添加标签</Button>
  
					  </td>
				  </tr>
  
			  </table>
  
		  </div>
	  </section>
	  
	  <myfooter></myfooter>
	  
	</div>
	
  </template>
  
  
   
  <script>
  
  //导包
  import myheader from './myheader.vue';
  import myfooter from './myfooter.vue';
  
  import {config,formatXml} from '../config.js'
  
  
  export default {
	data () {
	  return {
		msg: "这是一个变量",
		//声明面包屑变量
		datas:[{title:'首页',route:{name:'index'}},{title:'添加商品页面'}],
	//定义传递参数变量
		//商品名称
		name:'',
		//商品描述
		desc:'',
		//商品详情
		// parms:'',
		color:'',
		size:'',
		season:'',
		//商品价格
		price:'',
		//商品分类
		cate_id:'',


		//添加商品标签
		tags:'',

		//heyui商品标签变量
		mytags:'',
  
	  }
	},
  
	//注册组件标签
	components:{
	  'myheader': myheader,
	  'myfooter': myfooter,

  
	},
  
	mounted:function(){
	  
	
  },
	methods:{
  
		//提交
		submit:function(){
			
			// console.log(this.name)
			// console.log(this.desc)
			// console.log(this.price)
			// console.log(this.color)
			// console.log(this.season)
			// console.log(this.cate_id)

			var parms = {};
			parms['color'] = this.color;
			parms['size'] = this.size;
			parms['season'] = this.season;

			//格式化字符串
			parms = JSON.stringify(parms);
			console.log(parms)

			// //由字符换转换回json
			// parms = JSON.parse(parms);
			// console.log(parms)


			// //将变量转换为json格式
			// var parms_str = {"color":this.color,"season":this.season};
			// // console.log(parms_str)
			// //强转为字符串
			// parms_str = JSON.stringify(parms_str);
			// console.log(parms_str)
  
			//向后端发送请求
			this.axios.get(config['after_end'] + '/insertgoods/',{params:{name:this.name,				desc:this.desc,parms:parms,price:this.price,cate_id:this.cate_id}
			}).then((result)=>{
				//打印接口返回值
				console.log(result)
				//向用户提醒后端制定的message
				this.$Message(result.data.message)

				//商品入库成功才添加标签
				// if(result.data.id){
					//向后端发送请求(储存商品标签)
					this.axios.get(config['after_end'] + '/inserttags/',{params:{id:result.data.id,		tags:this.mytags,name:this.name,desc:this.desc,parms:parms,						price:this.price,cate_id:this.cate_id}
					}).then((result)=>{
						//打印接口返回值
						console.log(result)
						//向用户提醒后端制定的message
						this.$Message(result.data.message)
  
					})

				// }

			})
  
		},

		//添加商品标签
		add_tags:function(){
			//向后端发送请求
			this.axios.get(config['after_end'] + '/inserttags/',{params:{tags:this.tags}
			}).then((result)=>{
				//打印接口返回值
				console.log(result)
				//向用户提醒后端制定的message
				this.$Message(result.data.message)
  
			})
		}
  
		
	   
	},

  }
  
  
  </script>
   
  <style>
  
  
  
  </style>